<template>
  <div class="">
    <div style="display: flex;align-items: center;padding: 10px;">
      <label>accessKey：</label>
      <MInput style="flex: 1 1 100px;" v-model="accessKey"></MInput>
    </div>
    <div style="text-align: center;margin-top: 10px;">
      <MButton @click="renzheng">认证</MButton>
    </div>
  </div>
  <MMessage v-if="toastVisible" :message="toastMessage" :state="toastState" />

</template>

<script>
import { ref, onMounted } from "vue"
import MInput from "../components/MInput.vue"
import MButton from "../components/MButton.vue"
import axios from "../axios/axios"
import MMessage from '../components/MMessage.vue';
import { useRouter } from 'vue-router';
export default {
  name: 'AccessKeyInfo',
  components: {
    MInput,
    MButton,
    MMessage
  },
  setup() {
    const toastVisible = ref(false)
    const toastMessage = ref("")
    const toastState = ref("success")
    const isauthon = ref(false)
    const accessKey = ref("")
    const router = useRouter();
    const JSONbig = require('json-bigint');
    const messageShow = (msg, state) => {
      toastMessage.value = msg;
      toastVisible.value = true;
      toastState.value = state
      // 使用 setTimeout 模拟 Toast 组件内部的定时器功能（仅用于演示）
      // 在实际使用中，你应该依赖 Toast 组件内部的定时器
      setTimeout(() => {
        toastVisible.value = false;
      }, 3000); // 与 Toast 组件中的 duration 属性保持一致
    }
    const renzheng = () => {
      var info = JSONbig.parse(localStorage.getItem('IRAInfo'))

      axios.get("/train/authon?accesskey=" + encodeURIComponent(accessKey.value) + "&id=" + info.userId).then(res => {
        if (res.data.Code == "200") {
          messageShow("认证成功", "success")
          localStorage.setItem('X-Access-Key', accessKey.value)
          router.push('/defaultView');
        } else {
          messageShow(res.data.Msg, "warning")
        }
      })
    }
    onMounted(() => {
      var info = JSONbig.parse(localStorage.getItem('IRAInfo'))
      axios.get("/train/select?userId=" + info.userId).then(res => {
        if (res.data.Data.accesskey != null) {
          localStorage.setItem('X-Access-Key', res.data.Data.accesskey)
        }
      })
    })
    return {
      renzheng,
      toastVisible,
      toastMessage,
      toastState,
      accessKey,
      isauthon
    };
  },
};
</script>

<style scoped></style>
